<template>
  <el-card>
    <div slot="header">
      <span class="h3">查看客户信息</span>
      <span style="float:right;">
        <el-button type="primary" size="mini" @click="back">返回</el-button>
      </span>
    </div>
    <el-row type="flex" justify="center" class="confirm">
      <el-col :xl="14" :lg="18" :md="20" :sm="24" :xs="24">
        <v-form
          :form-title="formTitle"
          :form-data="formData"
          label-width="120px"
        >
          <template v-for="item in 2" slot-scope="props" :slot="'upload'+item">
            <el-form-item
              :label="props.info.cn"
            >
              <span>{{ props.info.info }}</span>
              <el-button size="mini" type="info">查看</el-button>
              <el-button size="mini" type="primary">
                <el-upload
                  :auto-upload="false"
                  :on-change="myUpload"
                  :on-success="handleAvatarSuccess"
                  action="action"
                >
                  上传
                </el-upload>
              </el-button>
              <el-button size="mini" type="danger">删除</el-button>
            </el-form-item>
          </template>

        </v-form>
      </el-col>
    </el-row>

  </el-card>
</template>

<script>
import { mapGetters } from 'vuex'
export default {
  data() {
    return {
      originData: {},
      formTitle: [
        {
          cn: '姓名',
          en: '姓名',
          disabled: true
        },
        {
          cn: '关联客户',
          en: '关联客户',
          disabled: true
        },
        {
          cn: '电话',
          en: '联系电话',
          disabled: true
        },
        {
          cn: '部门',
          en: '部门',
          disabled: true
        },
        {
          cn: '职务',
          en: '职务',
          disabled: true
        },
        {
          cn: '级别',
          en: '级别',
          disabled: true,
          type: 'select',
          list: [
            {
              label: '高层',
              value: '高层'
            },
            {
              label: '中层',
              value: '中层'
            },
            {
              label: '基层',
              value: '基层'
            }
          ]
        },
        {
          cn: '重要程度',
          en: '重要程度',
          disabled: true,
          type: 'select',
          list: [
            {
              label: '一星',
              value: '一星'
            },
            {
              label: '二星',
              value: '二星'
            },
            {
              label: '三星',
              value: '三星'
            },
            {
              label: '四星',
              value: '四星'
            },
            {
              label: '五星',
              value: '五星'
            }
          ]
        },
        {
          cn: '邮箱',
          en: '邮箱',
          disabled: true
        },
        {
          cn: 'qq',
          en: 'qq',
          disabled: true
        },
        {
          cn: '地址',
          en: '地址',
          disabled: true
        },
        {
          cn: '详细地址',
          en: '详细地址',
          disabled: true
        },
        {
          cn: '邮编',
          en: '邮编',
          disabled: true
        },
        {
          cn: '性别',
          en: '性别',
          disabled: true,
          type: 'select',
          list: [
            {
              label: '未设置',
              value: '未设置'
            },
            {
              label: '男',
              value: '男'
            },
            {
              label: '女',
              value: '女'
            }
          ]
        },
        {
          cn: '生日',
          en: '生日',
          disabled: true,
          // type:'birth',
          list: [
            {
              label: '公历',
              value: '1'
            },
            {
              label: '农历',
              value: '0'
            }
          ]
        },
        {
          cn: '爱好',
          en: '爱好',
          disabled: true
        },
        {
          cn: '决策关系',
          en: '决策关系',
          type: 'select',
          list: [
            {
              label: '关键决策人',
              value: '关键决策人'
            },
            {
              label: '商务决策人',
              value: '商务决策人'
            },
            {
              label: '技术决策人',
              value: '技术决策人'
            },
            {
              label: '财务决策人',
              value: '财务决策人'
            },
            {
              label: '使用人',
              value: '使用人'
            },
            {
              label: '意见影响人',
              value: '意见影响人'
            },
            {
              label: '普通人',
              value: '普通人'
            }
          ],
          disabled: true
        },
        {
          cn: '亲密度',
          en: '亲密度',
          type: 'select',
          list: [
            {
              label: '一星',
              value: '一星'
            },
            {
              label: '二星',
              value: '二星'
            },
            {
              label: '三星',
              value: '三星'
            },
            {
              label: '四星',
              value: '四星'
            },
            {
              label: '五星',
              value: '五星'
            }
          ],
          disabled: true
        },
        {
          cn: '创建人',
          en: '创建人id',
          disabled: true
        },
        {
          cn: '备注',
          en: '备注',
          type: 'textarea',
          disabled: true
        }
      ],
      formData: {}
    }
  },
  computed: {
    ...mapGetters([
      'details'
    ])
  },
  created() {
    const details = this.$route.params.details
    if (details) {
      localStorage.setItem('details', JSON.stringify(details))
      this.formData = this.$route.params.details
    }

    this.formData = localStorage.getItem('details') && JSON.parse(localStorage.getItem('details')) || {}
  },
  destroyed() {
    localStorage.removeItem('details')
  },
  methods: {
    getRoleLis() {

    },
    back() {
      this.$router.go(-1)
    },
    myUpload() {

    },
    handleAvatarSuccess() {

    }
  }
}
</script>

<style scoped>
    span + button {
        margin-left: 15px;
    }
</style>
